<template>
	<view class="wrapper">
		<div class="header posf flex-start cfff" :style="{padding:`calc(12rpx + ${safeTop}px) 20rpx 25rpx`}">
			<u-icon name="arrow-left" color="#fff" size="20" @click="back(1)"></u-icon>
			<div class="f30 ml20">激活成功</div>
		</div>
		<div class="top-box colum cfff">
			<u-icon name="rmb-circle" color="#fff" size="40" @click="back(1)"></u-icon>
			<div class="f40 mt30 mb15">激活成功</div>
			<div class="f22">您已成功激活品城卡，消费时余额可抵扣支付。</div>
		</div>
		<div class="bfff f26">
			<div class="f40 c333 fbold tCenter">￥0.0</div>
			<div class="hr"></div>
			<div class="space-between mb35">
				<div class="c999">品城卡号</div>
				<div class="c333">5688 566 988</div>
			</div>
			<div class="space-between mb35">
				<div class="c999">激活时间</div>
				<div class="c333">2020年5月5日</div>
			</div>
			<div class="space-between mb35">
				<div class="c999">可用余额</div>
				<div class="c333">2800 元</div>
			</div>
			<div class="space-between mb35">
				<div class="c999">有效期至</div>
				<div class="c333">2021年5月4日</div>
			</div>
			<div class="space-between mb35">
				<div class="c999">订单编号</div>
				<div class="c333">585655221321</div>
			</div>
		</div>
		<div class="center">
			<div class="btn center ctheme">查看品成卡</div>
			<div class="btn bth-red">立即购票 </div>
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		},
		methods: {
			scan() {
				uni.scanCode({
					success(e) {
						console.log(e)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.btn {
		width: 235rpx;
		height: 65rpx;
		border-radius: 33rpx;
		border: 1rpx solid #FF5555;
		margin: 0 45rpx;
	}
	.bfff {
		border-radius: 15rpx;
		margin: -190rpx 20rpx 60rpx;
		border: 1rpx solid #fff;
		padding: 55rpx 38rpx 0;

		

		.hr {
			background-color: #eee;
			height: 2rpx;
			margin: 50rpx 0 60rpx;
		}
	}

	.header {
		width: 100%;
		left: 0;
		top: 0;
	}

	.top-box {
		background: linear-gradient(to left, #F857A5, #FF5858);
		height: 620rpx;
		width: 1500rpx;
		margin-left: - 375rpx;
		border-radius: 0 0 70% 70%;
		padding-bottom: 100rpx;
	}
</style>